/** 初始化样式 */
export const defaultStyle = {
  /* 颜色 */
  color_gray0: {value: '#F5F6F7', unit: ''},
  color_gray1: {value: '#d0d3d6', unit: ''},
  color_gray2: {value: '#B2B4B8', unit: ''},
  ft_color: {value: '#fff', unit: ''},
  /* 层级 */
  desktop_icon_zindex: {value: 0, unit: ''}, // 桌面图标
  desktop_icon_active_zindex: {value: 1, unit: ''}, // 桌面图标（点击时）
  taskbar_zindex: {value: 20, unit: ''}, // 任务栏
  appwindow_zindex: {value: 10, unit: ''}, // 程序窗口
  appwindow_active_zindex: {value: 11, unit: ''}, // 程序窗口（活动）
  menu_zindex: {value: 100, unit: ''}, // 菜单（活动）
  popup_zindex: {value: 110, unit: ''}, // 弹窗（活动）
  popup_active_zindex: {value: 111, unit: ''}, // 弹窗（活动）
  /* 组件尺寸 */
  taskbar_height: {value: 50, unit: 'px'}, // 任务管理器
  taskbar_width: {value: '100%', unit: ''},
};
/**
 * 设置css变量函数
 * @return {Function} - 接收innerHTML，更新id为#appThemes的style标签
 * @param {Array} vars - 变量配置, 默认空对象
 */
const updateStyle = (() => {
  // 创建style标签
  let $style = document.createElement('style');
  $style.setAttribute("id", "appThemes");
  document.head.appendChild($style);
  $style = null;
  // 返回更新style方法
  return (innerHTML) => {
    let dom = document.querySelector('#appThemes');
    dom.innerHTML = innerHTML;
    dom = null;
  }
})();
/**
 * 设置css变量函数
 * @param {Object} vars - 变量配置, 默认空对象
 */
export const toggleTheme = (vars = {}) => {
  let innerHTML = '';
  let v = '';
  for (let i in vars) {
    v = vars[i];
    innerHTML = `${innerHTML}--${i}: ${v.value}${v.unit || ''};`
  }
  innerHTML = `:root{${innerHTML}}`;
  updateStyle(innerHTML);
};